import Vue from 'vue'
import App from './App.vue'
import "bootstrap/dist/css/bootstrap.css"
// 2、引入
import VueRouter from "vue-router"
import Find from "./views1/Find.vue"
import My from "./views1/My.vue"
import Ranking from "./views1/case/Ranking.vue"
import Recommend from "./views1/case/Recommend.vue"
import SongList from "./views1/case/SongList.vue"
// 3、注册
Vue.use(VueRouter)
// 4、创建路由规则数组
const routes = [
  {
    path: "/Find",
    component: Find,
    children: [
      {
        path: "Ranking",
        component: Ranking
      },
      {
        path: "Recommend",
        component: Recommend
      },
      {
        path: "SongList",
        component: SongList
      },
    ]
  },
  {
    path: "/My",
    component: My
  }
]
// 5、路由对象
const router = new VueRouter({
  routes
})
// 路由守卫
router.beforeEach((to, from, next) => {
  console.log(to, from, next)
  if (to.path == "/My") {
    alert("我的音乐")
    next(false)
  } else {
    next()
  }
})
Vue.config.productionTip = false
// 6、关联到vue实例
new Vue({
  router,
  render: h => h(App),
}).$mount('#app')
